<template>
    <div class="carousel-side">
        <slot></slot>
    </div>
</template>

<script>
	export default {
		name: 'CarouselItem',
		mounted () {
			if (window.outTime !== undefined) {
				clearInterval(window.outTime);
				window.outTime = undefined;
			}
			window.outTime = setInterval(() => {
				this.$parent.update();
				clearInterval(window.outTime);
			}, 300);
		}
	};
</script>

<style>
    .carousel-side {
        width: 100%;
        display: inline-block;
        position: relative;
        flex-shrink: 0;
        margin-right: 30px;
    }
</style>
